<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>参数传递</title>
</head>
<!-- 
  常用的配置
    method(String): HTTP请求方法，默认方法GET(GET,POST,PUT,DELETE)
    body(String): HTTP的请求参数
    headers(Object): HTTP的请求头，默认为{}
-->

<body>

</body>
<script>
  // 两种不同的get传递参数以及后台对应的接口
  "use strict";
  // GET请求的方式传递参数
  fetch(`/abc?id=123`).then(data => {
    return data.text();
  }).then(res => {
    console.log(res);
  });
  // 对应的后台接口
  app.get("/abc", (req, res) => {
    res.send(`传统的URL传递的参数${req.query.id}`);
  });




  fetch(`/abc/123`, {
    method: "get"
  }).then(data => {
    return data.text();
  }).then(res => {
    console.log(res);
  });
  //对应的后台接口
  app.get("/abc/:id", (req, res) => {
    res.send(`restful形式的url传递参数${req.params.id}`);
  });
</script>
<script>
  "use strict";
  // DELETE请求方式的参数传递
  fetch(`/abc/123`, {
    method: "delete"
  }).then(data => {
    return data.next();
  }).then(res => {
    console.log(res);
  });

  // 对应的后台接口
  app.delete("/abc/:id", (req, res) => {
    res.send(`delete请求传递的参数${req.params.id}`);
  });
</script>

</html>